<html lang="cn">

<head>
  <meta charset="UTF-8">
  <script src="../rem.js"></script>
  <meta name="format-detection" content="telephone = no">
  <meta name="viewport"
    content="initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <title></title>
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <link rel="stylesheet" href="../common.css">
  <link rel="stylesheet" href="./newDetailsOfBrandPage.css">
  <script>
    function rembig() {
      setRemSize()
      window.addEventListener("resize", setRemSize, false)

      function setRemSize() {
        var width = document.documentElement.clientWidth
        if (width > 750) {
          width = 750
        }
        var _clientWidth = width / 7.5 + 'px'
        document.documentElement.style.fontSize = _clientWidth
      }
    }
    rembig()
  </script>
</head>

<body>
  <div class="container">
    <div class="content">
      <div class="topImg">
        <img src="../images/detailsOfBrand/ppsj_qsdt_img.png">
        <div class="brandName needEllipsis">烫发剂行业十大品牌烫发剂行业十大品牌</div>
      </div>
      <div style="height: 1.32rem"></div>
      <div class="companyInformation">
        <img class="topTen" src="../images/detailsOfBrand/ppsi_sdpp_img.png">
        <div class="group">
          <div class="logoImage">
            <img src="../images/logo.png" alt="" srcset="">
          </div>
          <div class="center">
            <p class="voteTitle needEllipsis">晨阳科技晨阳科技晨阳科技</p>
            <p class="date"><img src="../images/time_show_icon.png" />&nbsp;更新：2019.5.8</p>
          </div>
          <!-- <div class="ranking">
            NO.03
          </div> -->
        </div>
        <ul class="descList">
          <li>
            <div class="left">公司名称:</div>
            <div class="right">晨阳科技网络有限责任</div>
          </li>
          <li>
            <div class="left">公司名称:</div>
            <div class="right">晨阳科技网络有限责任</div>
          </li>
          <li>
            <div class="left">公司名称:</div>
            <div class="right">晨阳科技网络有限责任公司晨阳科晨阳科技网络有限责任公司晨阳科晨阳科技网络有限责任公司晨阳科晨阳科技网络有限责任公司晨阳科</div>
          </li>
        </ul>
      </div>
      <div class="collapse">
        <div class="collapseRow">
          <h3 class="title">
            <span>泰昌</span>
            <img src="../images/detailsOfBrand/home_ppsjxqy_back_btn@2x.png">
          </h3>
          <div class="innerContent">
            <p>
              Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
              ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
              amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
              odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
            </p>
          </div>
        </div>
        <div class="collapseRow">
          <h3 class="title">
            <span>泰昌</span>
            <img src="../images/detailsOfBrand/home_ppsjxqy_back_btn@2x.png">
          </h3>
          <div class="innerContent">
            <p>
              Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
              ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
              amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
              odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
            </p>
          </div>
        </div>
      </div>
      <div class="bottomInfo">
        <img src="../images/报名活动页_slices/WeChat0cb4f1f9fa69309f03cd06c58006f7f2.png">
        <div style="color: rgba(156,156,156,1)">客服电话：123456789</div>
        <div class="feedback"><span>意见反馈</span> &nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<span>推荐参与活动</span></div>
        <div class="bottomTitle">中信品牌网</div>
        <p>京ICP备20190601号-1</p>
      </div>
      <div style="height: 0.98rem"></div>
    </div>
  </div>


</body>

</html>

<script>
  var detailsOfBrandPageInit = {
    collapse: function () {
      var imgs = $('.title img')
      var divs = $('.innerContent')
      var collapseRows = $('.collapseRow')
      // $(imgs[0]).css({
      //   transform: imgs[0].style.transform ? '' : 'rotate(90deg)'
      // })
      // $(collapseRows[0]).css('border-radius', '0.1rem')
      for (var i = 0; i < imgs.length; i++) {
        + function (i) {
          $(divs[i]).css({
            height: '0px',
            opacity: 0
          })
          // $(divs[0]).css({
          //   height: $(divs[0]).children().outerHeight() + 'px',
          //   opacity: 1
          // })
          $(imgs[i]).click(function () {
            for (let j = 0; j < divs.length; j++) {
              + function (j) {
                if (i === j) {
                  return
                }
                $(imgs[j]).css({
                  transform: ''
                })
                $(collapseRows[j]).css('border-radius', '0.49rem')
                $(divs[j]).css({
                  height: '0px',
                  opacity: 0
                })
              }(j)
            }
            $(collapseRows[i]).css({
              borderRadius: collapseRows[i].style.borderRadius == '0.1rem' ? '0.49rem' : '0.1rem'
            })
            $(imgs[i]).css({
              transform: imgs[i].style.transform ? '' : 'rotate(90deg)'
            })
            $(divs[i]).css({
              height: imgs[i].style.transform ? $(divs[i]).children().outerHeight() + 'px' : '0px',
              opacity: imgs[i].style.transform ? 1 : 0
            })
          })
        }(i)
      }
    }
  }
  $(document).ready(function () {
    for (var i in detailsOfBrandPageInit) {
      detailsOfBrandPageInit[i]()
    }
    var con = new Contact()
    con.addBackVote({href: '?????'})
    con.addTopBack()
  })
</script>